<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <!-- 导入Bootstrap的css文件 -->
    <link rel="stylesheet" href="../static/css/bootstrap.min.css">
    <!-- 导入sigin.css的文件 -->
    <link rel="stylesheet" href="../static/css/signin.css">
    <!-- 导入浏览器ico图标 -->
    <link rel="shortcut icon" href="../static/images/cup.ico">
</head>

<!-- 具体样式 -->

<body class="text-center">
    <form class="form-signin">
        <img class="mb-4" src="../static/images/touxiang.jpg" alt="" width="72" height="72">
        <h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
        <label for="inputEmail" class="sr-only">Email address</label>
        <input type="email" id="inputEmail" class="form-control" placeholder="用户名" required autofocus>
        <label for="inputPassword" class="sr-only">Password</label>
        <input type="password" id="inputPassword" class="form-control" placeholder="密码" required>
        <div class="checkbox mb-3">
            <label>
                <input type="checkbox" value="remember-me"> 记住我
            </label>
        </div>
        <button class="btn btn-lg btn-primary btn-block" type="button" onclick="login()">登录</button>
        <p class="fg">
            <a href="">忘了密码？</a>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="/register.html">注册新账号</a>
        </p>
        <p class="mt-5 mb-3 text-muted">&copy; By 啊炎同学</p>
    </form>

    <!-- 逻辑处理 -->
    <script>
        function login() {
            // 获取用户名
            let username = $('#inputEmail').val();
            // 获取密码
            let password = $('#inputPassword').val();
            // 登录判断
            if (username === '') {
                alert('用户名不能为空！');
            } else if (password === '') {
                alert('密码不能为空！');
            } else {
                // 登陆成功跳转至主页面
                window.location.href = '/home.html';
            }
        }
    </script>

    <!-- 导入jQuery -->
    <script src="../static/js/jquery-3.6.0.min.js"></script>
    <!-- 导入Bootstrap的js文件 -->
    <script src="../static/js/bootstrap.min.js"></script>
</body>

</html>